<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix = "s" uri = "/struts-tags" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">  
    <title>轻松课堂后台</title>
    <meta name="description" content="">
    <meta name="author" content="macc">

    <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,400italic,700' rel='stylesheet' type='text/css'>
    <link href="../css/font-awesome.min.css" rel="stylesheet">
    <link href="../css/bootstrap.min.css" rel="stylesheet">
    <link href="../css/templatemo-style.css" rel="stylesheet">
    
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->

  </head>
  <body>
    <!-- result用于判断文件提交作成功 -->
    <input type = "hidden" id = "uploadresult" value = "${uploadresult}">
    <!-- 左侧导航栏 -->
    <div class="templatemo-flex-row">
      <div class="templatemo-sidebar">
        <header class="templatemo-site-header">
          <div class="square"></div>
          <h1>${sessionScope.username}</h1>
        </header>
        <div class="profile-photo-container">
          <img src="../images/file_photo.jpg" alt="Profile Photo" class="img-responsive">  
        </div>    
       
        <div class="mobile-menu-icon">
            <i class="fa fa-bars"></i>
          </div>
        <nav class="templatemo-left-nav">          
          <ul>
            <li><a href="<s:url action='FileManage_uploadIndex' namespace='/file'/>" class="active"><i class="fa fa-file fa-fw"></i>数据导入</a></li>
          <%--   <li><a href="<s:url action='OperatorManage_index' namespace='/operator'/>" class="active"><i class="fa fa-male fa-fw"></i>操作员管理</a></li>
            <li><a href="<s:url action='RoomtypeManage_index' namespace='/roomtype'/>"><i class="fa fa-home fa-fw"></i>客房类型管理</a></li>
            <li><a href="<s:url action='RoomManage_index' namespace='/room'/>"><i class="fa fa-coffee fa-fw"></i>客房管理</a></li> --%>
            <li><a href="<s:url action='LoginManage_logout' namespace='/login'/>"><i class="fa fa-power-off fa-fw"></i>登出</a></li>
          </ul>  
        </nav>
      </div>
      <!-- Main content --> 
      <div class="templatemo-content col-1 light-gray-bg">
        <div class="templatemo-top-nav-container">
          <div class="row">
            <nav class="templatemo-top-nav col-lg-12 col-md-12">
              <ul class="text-uppercase">
                <li><a href="<s:url action='FileManage_uploadIndex' namespace='/file'/>" class="active">数据导入</a></li>
                <%-- <li><a href="<s:url action='OperatorManage_addoperator' namespace='/operator'/>">添加操作员</a></li> --%>
              </ul>  
            </nav> 
          </div>
        </div>
        <div class="templatemo-content-container">
          <div class="templatemo-content-widget no-padding">
               <div class="panel panel-default margin-10">
                <div class="panel-heading"><h2 class="text-uppercase">添加操作员</h2></div>
                	<div class="panel-body">
                	<!-- 添加操作员 -->
	                  <s:form action="FileManage_uploadfile" namespace='/file' enctype="multipart/form-data" method="post" class="templatemo-login-form">
			        	<input type = "hidden" name = "tid" value = "${sessionScope.tid}">
			        	<div align="center" class="form-group">
			        		<div class="input-group">
				        		<label>请选择excel文件上传(.xls) </label>        		
				              	<input name = "upfile"  id = "upfile" type="file" class="form-control" placeholder="未选择文件">           
				          	</div>	
			        	</div>
						<div class="form-group" align="center">
              				<button type="submit" onClick="return check();" class="templatemo-blue-button width-30" >提交</button>
						</div>
			        </s:form>
                </div>                
              </div>                         
          </div>                  
        </div>
        	<footer class="text-right">
	            <p> 2017 &copy; 轻松课堂
	            |  Developed by Macc</p>
          	</footer>    
      </div>
    </div>
    
    <!-- JS -->
    <script type="text/javascript" src="../js/jquery-1.11.2.min.js"></script>      <!-- jQuery -->
    <script type="text/javascript" src="../js/templatemo-script.js"></script>      <!-- Templatemo Script -->
    <script type="text/javascript" src="../js/bootstrap.min.js"></script>
     <script>
      $(document).ready(function(){
        // Content widget with background image
        var imageUrl = $('img.content-bg-img').attr('src');
        $('.templatemo-content-img-bg').css('background-image', 'url(' + imageUrl + ')');
        $('img.content-bg-img').hide();        
      });
    </script>
<!-- 模态框（Modal） -->
<div class="modal fade" id="successModal" tabindex="-1" role="dialog" 
   aria-labelledby="updatetitle" aria-hidden="true">
   <div class="modal-dialog">
      <div class="modal-content">
         <div align="center" class="modal-header">
            <h4 class="modal-title" id="updatetitle">
             	数据导入成功！
            </h4>
         </div>
      </div><!-- /.modal-content -->
	</div><!-- /.modal -->
</div>
<div class="modal fade" id="failModal" tabindex="-1" role="dialog" 
   aria-labelledby="addtitle" aria-hidden="true">
   <div class="modal-dialog">
      <div class="modal-content">
         <div align="center" class="modal-header">
            <h4 class="modal-title" id="addtitle">
             	数据导入失败，请检查excel内容格式
            </h4>
         </div>
      </div><!-- /.modal-content -->
	</div><!-- /.modal -->
</div>
<div class="modal fade" id="waittingModal" tabindex="-1" role="dialog" 
   aria-labelledby="addtitle" aria-hidden="true">
   <div class="modal-dialog">
      <div class="modal-content">
         <div align="center" class="modal-header">
            <h4 class="modal-title" id="addtitle">
             	<i class="fa fa-spinner fa-pulse"></i>正在导入数据，请稍后...
            </h4>
         </div>
      </div><!-- /.modal-content -->
	</div><!-- /.modal -->
</div>
<div class="modal fade" id="nofileModal" tabindex="-1" role="dialog" 
   aria-labelledby="addtitle" aria-hidden="true">
   <div class="modal-dialog">
      <div class="modal-content">
         <div align="center" class="modal-header">
            <h4 class="modal-title" id="addtitle">
             	请选择要上传的文件后重试
            </h4>
         </div>
      </div><!-- /.modal-content -->
	</div><!-- /.modal -->
</div>
<div class="modal fade" id="wrongfileModal" tabindex="-1" role="dialog" 
   aria-labelledby="addtitle" aria-hidden="true">
   <div class="modal-dialog">
      <div class="modal-content">
         <div align="center" class="modal-header">
            <h4 class="modal-title" id="addtitle">
             	该文件类型不被支持。请上传“.xls”为后缀的文件，即excel 97~2003版本的excel
            </h4>
         </div>
      </div><!-- /.modal-content -->
	</div><!-- /.modal -->
</div>
<div class="modal fade" id="wrongpathModal" tabindex="-1" role="dialog" 
   aria-labelledby="addtitle" aria-hidden="true">
   <div class="modal-dialog">
      <div class="modal-content">
         <div align="center" class="modal-header">
            <h4 class="modal-title" id="addtitle">
             	文件路径有误，请重试
            </h4>
         </div>
      </div><!-- /.modal-content -->
	</div><!-- /.modal -->
</div>
     <script>
     //通过result标识符来判断删除/添加/修改是否成功来弹出对应的提示框
     $(function()
	   	{
    	 	var result = document.getElementById("uploadresult").value
	   	 	if(result == "success")
  	 		{
	   	 		$('#successModal').modal("show");
	   	 		setTimeout(function(){$("#successModal").modal("hide")},1000);
  	 		}
		   	if(result == "fail")
		 	{
		 		$('#failModal').modal("show");
		 		setTimeout(function(){$("#failModal").modal("hide")},1000);
		 	}
	   	});
     
     function check(){
 		  var file = document.getElementById("upfile").value;
 	      if (file == null||file == ""){  
 	    	   $('#nofileModal').modal("show");
   	 		   setTimeout(function(){$("#nofileModal").modal("hide")},1000);  
 	           return false;  
 	      }  
 	      if (file.lastIndexOf('.')==-1){    //如果不存在"."    
 	    	  $('#wrongpathModal').modal("show");
  	 		  setTimeout(function(){$("#wrongpathModal").modal("hide")},1000);  
 	          return false;  
 	      }  
 	      var extName = file.substring(file.lastIndexOf(".")).toLowerCase();//（把路径中的所有字母全部转换为小写）   
 	      if(extName != ".xls")          
 	      {  
 	    	  $('#wrongfileModal').modal("show");
  	 		  setTimeout(function(){$("#wrongfileModal").modal("hide")},2000); 
 	          return false;  
 	      }  	
 	     $('#waittingModal').modal("show");
	 	//	  setTimeout(function(){$("#waittingModal").modal("hide")},2000); 
     }
     </script>
  </body>
</html>
</html>